<template>
  <div class="demo">
    <div class="demo-title">额外的页脚</div>
    <div class="demo-content">
      <Space direction="vertical">
        <DatePicker>
          <template #renderExtraFooter>extra footer</template>
        </DatePicker>
        <DatePicker show-time>
          <template #renderExtraFooter>extra footer</template>
        </DatePicker>
        <DatePicker.RangePicker>
          <template #renderExtraFooter>extra footer</template>
        </DatePicker.RangePicker>
        <DatePicker.RangePicker show-time>
          <template #renderExtraFooter>extra footer</template>
        </DatePicker.RangePicker>
        <DatePicker placeholder="Select month" picker="month">
          <template #renderExtraFooter>extra footer</template>
        </DatePicker>
      </Space>
    </div>
  </div>
</template>

<script lang="ts" setup>
  import Space from '@sscd/space';
  import DatePicker from '@sscd/date-picker';
</script>
